﻿/* DO NOT CHANGE: This ensures that all links look 
   like links, even when they only run JavaScript functions */
a
{
    cursor:pointer;
}

/* This is the default font */
a, div, input, h1, h2, h3, h4, h5, h6, li, option, p, select, span, textarea
{
    font-family:"Trebuchet MS", Helvetica, Arial, Sans-Serif;
}

/* This is the default font size */
a, div, input, li, option, p, select, span, textarea
{
    font-size:small;
}


/* This sets the color of links and error messages */
a, div#commentError, div#formError, div#linkError, div#listError, div#searchError, div#uploadedFile, div.articleError, div.deleteArticleError, p.formError, span.error, span.subscribeError
{
    color:#333333;
}

/* This sets the style for links in the right column
   and the page number links in the footer */
a.pageLink, a.pageLinkActive, a.tagLink, a.tagLinkActive
{
    text-decoration:none;
    font-size:small;
}

/* This spaces the page number links on the footer apart
   from each other */
a.pageLink, a.pageLinkActive
{
    font-weight:bolder;
    margin-right:20px;
}

/* This is the color of inactive links in the right 
  column and footer */
a.pageLink, a.tagLink
{
    color:#FFFFFF;
}

/* This makes the text in article details smaller */
a.tiny, span.error, span.subscribeError, span.tiny
{
    font-size:smaller;
}

/* This is the style for an article's main title */
a.titleLink, h1
{
    padding-top:3px;
    font-size:large;
    text-decoration:none;
}

/* The body style -- add background image here, if you;d like */
body
{
    background-color: #CCCCCC;
    margin:20px 20px 20px 20px;
}

/* This is the main text color */
div, input, h1, h2, h3, h4, h5, h6, li, p, pre, span, textarea
{
    color:#666666;
}

/* DO NOT CHANGE: This allows the "account" links
   to change shape after a link is clicked */
div#account
{
    overflow:hidden;
}

/* DO NOT CHANGE: This sets the margin above returned 
   error/response messages at the bottom of forms after */
div#commentError, div#formError
{
    padding-top:5px;
}

/* This is the width of the main content. Only change this if
   you're changing the width of the site */
div#articles, div#list, div#form, div#response, div.searchResult
{
    width:720px;
}

/* DO NOT CHANGE: This allows articles to take up the 
   entire space of main content area */
div#articles
{
    margin:0 0 0 0;
    padding:0 0 0 0;
}

/* DO NOT CHANGE: This style allows some content to be 
   handled off-screen */
div#buffer, iframe#uploadWindow
{
    position:absolute;
    left:-1000px;
    top:-1000px;
    visibility:hidden;
    height:1px;
    overflow:hidden;
}

/* This is the wrapper which holds the main content 
   (like articles, etc) and the links in the right column.
   This does *not* include the header or footer */
div#content
{
    background-color:#EEEEEE;
    float:left;
    margin:0 auto 10px 0;
    padding:10px 10px 10px 10px;
    width:940px;
}

/* This is the header */
div#header
{   
    padding:10px 10px 10px 10px; 
    background-color:#BBBBBB;
}

/* DO NO CHANGE: This puts the main content on the left 
   side. If you want this on the right, change the "float" 
   property to "right", and then change the "div#rightColumn"
   style's "float" property to "left". */
div#leftColumn
{
    float:left;
}

/* DO NOT CHANGE: This hides elements which hold error
   messages */
div#listError
{
    visibility:hidden;
}

/* DO NOT CHANGE: This makes the markup bar (the text formatting
   buttons you see when editing an article or comment) look neat-o */
div#markupBar
{
    float:left;
    width:360px;
}

/* This is the box that holds the "NO PHOTO" text on the
   profile update page (profile photos must be enabled)
   when an author has not uploaded a profile photo */
div#noPhoto
{
    text-align:center;
    vertical-align:middle;
}

/* This is the background color for the right column, footer, 
   comment header, and "NO PHOTO" box */
div#noPhoto, div#pagination, div.commentHeader, div.tags, h4.updateComment
{
    background-color:#BBBBBB;
}

/* DO NOT CHANGE: This is the style for the footer where 
   the page links and "nickel" image show up. Changes here 
   are not the end of the world, but advised against. */
div#pagination
{
    margin-left:auto;
    margin-right:auto;
    padding: 10px 10px 10px 10px;
    width:940px;
    clear:both;
}

/* DO NOT CHANGE: This is the style that makes the right column 
   stickt to the right. If you want this on the left, change the 
   "float" property to "left", and then change the "div#leftColumn"
   style's "float" property to "right". */
div#rightColumn
{
    float:right;
    margin:auto 0 auto 0;
    padding: 0 0 0 0;
    width:200px;
}

/* DO NOT CHANGE: This is the style for the submit form's button */
div#searchFormSubmit
{
    float:right;
    padding:0 0 0 0;
    text-align:left;
    width:60px;
}

/* DO NOT CHANGE: This is the style for the submit form's input */
div#searchFormInput
{
    float:left;
    padding:0 10px 0 0;
    width:100px;
}

/* DO NOT CHANGE: This holds the links to files after uploading
   in the article forms */
div#uploadedFile
{
    margin:5px 0 5px 0;
    text-align:left;
    width:500px;
    float:right;
}

/* DO NOT CHANGE: This makes the upload button in the article form
   less intrusive */
div#uploadInput
{
    float:right;
    text-align:right;
    width:130px;
}

/* DO NOT CHANGE: This holds the word "Upload" in the upload form */
div#uploadTitle
{
    float:left;
    margin:3px 0 0 0;
    text-align:right;
    width:45px;
}

/* This holds the entire layout, not including the empty space to 
   the sides of the main content */
div#wrapper
{
    background-color:#FFFFFF;
    margin:0 auto 0 auto;
    padding:10px 10px 10px 10px;
    width:960px;
}

/* DO NOT CHANGE: This helps position the result text from an 
   article update */
div.articleError, div.deleteArticleError
{
    float:right;
    text-align:left;
}

/* DO NOT CHANGE: This helps position the result text from an 
   article update */
div.articleError
{
    width:460px;
}

/* DO NOT CHANGE: This keeps article text from running into 
   the content area edges */
div.articleText
{
    margin:5px 0 5px 0;
}

/* DO NOT CHANGE: This makes the "attachment" element look more 
   like an attachment. Only edit if you change the width of the site */
div.attachment
{
    width:620px;
    text-align:left;
}

/* DO NOT CHANGE: This is the bar that appears at the top of 
   each comment. It holds the poster's picture (if enabled) 
   name and edit links. Only change if you increase the font size
   dramatically. */
div.commentHeader
{
    height:20px;
    margin:20px 0 10px 0;
    vertical-align:middle;
}

/* DO NOT CHANGE: This helps position text returned when 
   there is an error deleting an article */
div.deleteArticleError
{
    width:265px;
}

/* DO NOT CHANGE: This sets the style for media embedded into articles.
   Only update if you change the width of the site. */
div.embed
{
    margin:0 auto 0 auto;
    padding:5px 0 5px 0;
    width:620px;
    text-align:center;
}

/* DO NOT CHANGE: This sets the height of a single line form item. 
   Only change if your increase the font size dramatically. */
div.formLine
{
    height:28px;
    vertical-align:middle;
}

/* DO NOT CHANGE: This helps to properly position checkboxes 
   in a form */
div.formCheckBoxes
{
    margin-top:5px;
}

/* DO NOT CHANGE: This positions elements on the right side 
   in a form */
div.formInput, div.formCheckBoxes
{
    float:right;
    padding-left:0px;
    vertical-align:middle;
    text-align:left;
    width:500px;
}

/* DO NOT CHANGE: This positions labels on the left side in
   a form */
div.formLabel
{
    float:left;
    padding:3px 10px 0 0;
    text-align:right;   
    width:200px;
}

/* DO NOT CHANGE: This holds the text in a search result */
div.resultText
{
    margin:-7px 0 5px 0;
    width:620px;
}

/* DO NOT CHANGE: This helps position the search form */
div.searchFormLine
{
    height:28px;
    margin-top:10px;
    vertical-align:middle;
}

/* DO NOT CHANGE: This helps position checkboxes in forms */
div.tagCheckbox
{
    width:100px;
    float:left;
}

/* DO NOT CHANGE: This positions elements in the sign-in form */
div.tagFormInput
{
    float:right;
    padding-left:0px;
    text-align:left;
    width:110px;
}

/* DO NOT CHANGE: This positions labels in the sign-in form */
div.tagFormLabel
{
    float:left;
    padding:3px 0 0 0;
    text-align:right;   
    width:60px;
}

/* DO NOT CHANGE: This positions lines in the sign-in form */
div.tagFormLine
{
    height:28px;
    vertical-align:middle;
}

/* DO NOT CHANGE: This sets the position of the submit 
   button on the tag form */
div.tagListSubmit
{
    float:left;
    text-align:left;
    padding-right:10px;
}

/* DO NOT CHANGE: This sets the size and margins for elements
   in the right column. Only update if change the width of the site
   and/or the right column */
div.tags
{
    padding:5px 10px 10px 10px;
    margin-bottom:10px;
    width:180px;
}

/* DO NOT CHANGE: This keeps the uploader from looking 
   like a mess */
form
{
    margin:0 0 0 0;
    padding:0 0 0 0;
}

/* DO NOT CHANGE: This keeps headline text from crowding */
h1, h2, h3, h4, h5, h6
{
    margin:5px auto 0 auto;
}

/* DO NOT CHANGE: This keeps article titles from crowding up
   against the details */
h1
{
    margin-bottom:5px;
}

/* This is line height for all text */
h1, h2, h3, h4, h5, h6, li, p, pre, span, textarea
{
    line-height:14pt;
}

/* This sets the style for the text that appears in the header
   of the comment edit form */
h4.updateComment
{
    color:#FFFFFF;
    padding:5px 5px 5px 5px;
}

/* This stylizes horizontal rules, which appear as separators 
   between articles */
hr
{
    border:0;
    color:#666666;
    background-color:#666666;
    width:720px;
    height:1px;
}

/* This is the style for form elements (text input, submit 
   buttons, etc) */
input, input.ready
{
    background-color:#FFFFFF;
    border-color:#666666;
    border-style:solid;
    border-width:1px;
    color:#666666;
    font-size:smaller;
    margin:2px 0 2px 0;
    padding:2px 4px 2px 4px;
}

/* DO NOT CHANGE: This keeps borders from appearing around 
   linked images on older browsers */
img
{
    border-style:none;
}

/* DO NOT CHANGE: This sets the width of the search form input */
input#search
{
    width:100px;
}

/* DO NOT CHANGE: This sets the size of the search form 
   submit button */
input#searchSubmit
{
    padding:2px 0 2px 0;
    width:60px;
}

/* DO NOT CHANGE: This makes the upload form pretty, especially
   on Chrome :D  */
input#upload
{
    width:72px;
}

/* DO NOT CHANGE: This sets the width of the single line 
   elements in the article form. */
input.articleInput
{
    width:500px;
}

/* This is the style for buttons that are "greyed out" while
   a request is in progress */
input.busy
{
    background-color:#EEEEEE;
    color:#999999;
}

/* DO NOT CHANGE: This helps position checkboxes */
input.checkbox
{
    margin-top:5px;
}


/* DO NOT CHANGE: This sets the width for sign-in form elements */
input.rightColumn
{
    width:100px;
}

/* DO NOT CHANGE: This removes the ugly border around the button
   you click to choose a file to upload */
input.uploadButton
{
    background-color:transparent;
    border-style:none;
    margin:2px 0 0 0;
    padding:0 0 0 0;
}

/* This is the style for the titles in the modules in the 
   right column */
p.tagTitle
{
    font-size:x-small;
    font-weight:bold;
    margin-bottom:4px;
}

/* This removes the underline from links that use the 
   right column title style */
p.tagTitle a
{
    text-decoration: none;
}

/* This is the style for "code" blocks and the big text input 
   for articles */
pre, textarea
{
    border-color:#333333;
    border-style:solid;
    border-width:1px;
    font-family:Monospace;
    font-size:9pt;
    padding:10px 10px 10px 10px;
    width:700px;
}

/* DO NOT CHANGE: This makes big text inputs resizeable without
   breaking the layout */
textarea
{
    height:150px;
    width:500px;
    max-height:400px;
    max-width:710px;
}

/* DO NOT CHANGE: This prevents the article text editor from breaking
   the layout while dragging */
textarea.articleText
{
    width:490px;
    max-width:490px;
}